<template>
  <div class="flex-al box btn-box-bg">
    <build-el-h1 name="获奖查询.png" type="2"></build-el-h1>
    <el-input placeholder="请输入姓名" v-model="name" size="medium" clearable style="margin-bottom:20px"></el-input>
    <el-input
      placeholder="请输入档案标号"
      v-model="code"
      size="medium"
      clearable
      style="margin-bottom:20px"
    ></el-input>
    <p class="warn-p" v-if="dataObj&&!dataObj.data">{{dataObj.content}}</p>
    <p class="success-p" v-if="dataObj&&dataObj.data">恭喜您，获奖有效！</p>

    <el-button type="primary" style="width:100%;margin-bottom:60px" @click="chaxun">查询</el-button>
  </div>
</template>
<script>
import buildElH1 from '../build-el-h1'
export default {
  components: {
    buildElH1,
  },
  data() {
    return {
      name: '',
      code: '',
      dataObj: null,
    }
  },
  methods: {
    async chaxun() {
      let dataObj = await this.api.verification(this.name, this.code)
      this.dataObj = dataObj
      console.log(dataObj)
    },
  },
}
</script>
<style lang="less" scoped>
.btn-box-bg {
  /deep/ .el-button--primary {
    background-color: #222;
    border-color: #222;
    font-size: 13px;
  }
}
.box {
  padding: 0 30px;
  margin-top: 45px;
  box-sizing: border-box;
  .warn-p {
    font-size: 14px;
    color: #bf1425;
    margin-bottom: 20px;
  }
  .success-p {
    font-size: 14px;
    color: green;
    margin-bottom: 20px;
  }
}
</style>